<template>
  <d-scroll-view  @refresherrefresh="getDetail" :refresher-triggered="triggered">
    <proj-detail-layout :process-instance-id="processInstanceId" :project-number="projectNumber">
    <d-forms label-width="200rpx">
      <d-forms-item label="变更类型" :type="DFormInputType.DICT" :dict-type="PM_DICT_TYPE.PROJECT_CHANGE_TYPE" :input="form.changeType"></d-forms-item>
      <d-forms-item label="生效时间" :type="DFormInputType.DATE" :input="form.effectiveDate" format="yyyy-MM-dd"></d-forms-item>
      <d-forms-item label="跟踪人">
        <pm-user-select disabled :user-id="form.follower"></pm-user-select>
      </d-forms-item>
      <view>
        <view class="form-title-1">变更原因</view>
        <d-card>
          <d-forms-item disabled :input="form.changeReason"></d-forms-item>
        </d-card>
      </view>
      <view>
        <view class="form-title-1">变更前</view>
        <d-card>
          <d-forms-item disabled :input="form.beforeChange"></d-forms-item>
        </d-card>
      </view>
      <view>
        <view class="form-title-1">变更后</view>
        <d-card>
          <d-forms-item disabled :input="form.afterChange"></d-forms-item>
        </d-card>
      </view>
      <view>
        <view class="form-title-1">附件</view>
        <d-card>
          <pm-file-upload readonly :files="form.file"></pm-file-upload>
        </d-card>
      </view>
    </d-forms>
  </proj-detail-layout>
  </d-scroll-view>
</template>

<script setup lang="ts">
import ProjDetailLayout from "@/components/ProjDetailLayout/index.vue";
import {useProjectChangeApi} from "@/api/pm/project/projectChange";
import {DFormInputType} from "@/utils/enum";
import {PM_DICT_TYPE} from "@/utils/pmDict";

defineOptions({ name: 'ProjectChangeApply' })

const initForm = {
  changeType: null,
  changeTypeName: null,
  follower: null,
  effectiveDate: null,
  changeReason: null,
  beforeChange: null,
  afterChange: null,
  file: null,
  storaged: null,
  trends: null,
  result: null,
  id: null,
  createTime: null,
  processInstanceId: null,
}
const form = ref<ProjectChangeForm>(initForm)
const triggered = ref<boolean>(false);
function getDetail() {
  if (processInstanceId.value) {
    triggered.value = true;
    useProjectChangeApi().getProjectChangeByProcess(processInstanceId.value).then(res => {
      if (res.code === 0) {
        form.value = res.data || initForm
      }
    }).finally(() => {
      triggered.value = false;
    })
  }
}

const projectNumber = ref<string>(null);
const processInstanceId = ref<string>(null);
onLoad((query) => {
  projectNumber.value = query['project_number']
  processInstanceId.value = query['process_instance_id']
  getDetail();
})
</script>

<style scoped lang="scss">

</style>
